<template>
	<scroll-view scroll-y class="scroll-view">
		<view class="viewport">
			<TDYSwiper :list="bannerItems"></TDYSwiper>
			<view class="container">
				<formVue :queryParams="queryParams" />
				<home-card></home-card>
				<view style="height: 60px;"></view>
			</view>

		</view>

	</scroll-view>
</template>

<script setup lang="ts">
	import {formatDate} from '@/utils'
	import formVue from './components/form.vue';
	import homeCard from './components/home-card.vue';
	import type { BannerItem } from '@/types/index'
	import { getImg } from '@/utils/index'
	import { ref } from 'vue';
	import { onShow } from '@dcloudio/uni-app';
	const  queryParams =  ref({
		CheckIn:"",
		CheckOut: "",
		destinationsName:'',
		BrandName:'',
	})
	onShow(() => {
	  const params = uni.getStorageSync('homeParams');
	  if (params) {
	    console.log('接收的参数：', params);
		queryParams.value.CheckIn=params.CheckIn || formatDate(new Date(),'YYYY-MM-DD')
		queryParams.value.CheckOut=params.CheckOut || formatDate(new Date().setDate(new Date().getDate() + 1),'YYYY-MM-DD')
		queryParams.value.destinationsName=params.destinationsName
		queryParams.value.BrandName=params.BrandName
		
		console.log(queryParams.value)
		// uni.removeStorageSync('homeParams')
	  }else{
		  queryParams.value={
			  CheckIn:formatDate(new Date(),'YYYY-MM-DD'),
			  CheckOut:formatDate(new Date().setDate(new Date().getDate() + 1),'YYYY-MM-DD'),
			  destinationsName:'',
			  BrandName:'',
		  }
	  }
	});
	const bannerItems = ref<BannerItem[]>([
		{
			imgUrl: 'https://img.remit.ee/api/file/BQACAgUAAyEGAASHRsPbAAEDF4Fo3i5HHsLag2lxaMvURYUzBfj2dQACAxcAAoCv8FYzlukhnucm6jYE.jpg',
			id: '1',

			name: '迪拜中央大道凯宾斯基酒店',
			nameEn: '七星级奢华体验',
		},
		{
			imgUrl: 'https://img.remit.ee/api/file/BQACAgUAAyEGAASHRsPbAAEDF3xo3i2QYISR2vrbjKgF7XcHYui0PQAC9xYAAoCv8Faz-uwAAfOHwN02BA.jpg',
			id: '2',
			name: '香港半岛酒店',
			nameEn: '九龙中心，非凡体验'
		}, {
			imgUrl: 'https://img.remit.ee/api/file/BQACAgUAAyEGAASHRsPbAAEDF35o3i3CafJbkU4j5yFBg8n8FLVIFwAC-hYAAoCv8FZaVXun0Loq1TYE.jpg',
			id: '3',
			name: '巴黎丽思卡尔顿',
			nameEn: '法国奢华体验',

		}
	])
</script>

<style lang="scss">
	page {
		background-color: #f7f8fa;
		height: 100%;
		overflow: hidden;
	}

	.viewport {
		height: 100%;

		.container {
			display: flex;
			flex-direction: column;
			justify-content: center;
			align-items: center;
		}
	}

	.card {
		width: 95vw;

		image {
			width: 100%;
			height: 256rpx;
		}
	}

	.scroll-view {
		flex: 1;
		overflow: hidden;
	}
</style>